<template>
	<view>
		<Phone v-if="this.name==='phone'" ref='myComponent'></Phone>
		<Password v-else-if="this.name==='password'||this.name==='repassword'" :message="get_message" ref='myComponent'>
		</Password>
		<NumberInput v-else-if="this.name === 'id'" ref='myComponent' :message="get_message"></NumberInput>
		<NormalInput v-else :message="get_message" ref='myComponent'></NormalInput>
		<!-- <component :is="comInput" :message="get_message"></component> -->
	</view>
</template>

<script>
	import NormalInput from '../Input/NormalInput.vue'
	import Phone from '../Input/Phone.vue'
	import Password from '../Input/Password.vue'
	import NumberInput from "@/components/Input/NumberInput.vue"
	const inputMap = {
		username: "请输入昵称...",
		password: "请输入密码...",
		repassword: "请再次输入密码...",
		code: "请输入验证码...",
		id: "请输入账号...",
		phone: "请输入邮箱或手机号..."
	}
	export default {
		props: {
			name: '',
		},
		computed: {
			get_message() {
				console.log(this.name)
				console.log(inputMap[this.name])
				return inputMap[this.name]

			},
			comInput() {
				if (this.name === 'Phone') {
					return Phone
				} else if (this.name === 'id') {
					return NumberInput
				} else {
					return NormalInput
				}
			}
		},
		components: {
			NormalInput,
			Phone,
			Password,
			NumberInput
		},
		data() {
			return {
				input: ""
			}
		},
		methods: {
			getinput() {
				return this.$refs.myComponent.input
			}
		}
	}
</script>

<style>

</style>
